performance.now() 2023

MC: Phil Hawksworth

Developer Experience, Netlify, @philhawksworth@indieweb.social

Phil Hawksworth is Principal Developer Experience Engineer at Netlify.

With a passion for browser technologies, and the empowering properties of the web, he loves seeking out ingenuity and simplicity, especially in places where over-engineering is common.

After almost 25 years of building web applications for companies such as Google, Apple, Nike, R/GA, and The London Stock Exchange, Phil has worked to challenge traditional technical architectures in favour of simplicity and effectiveness.

Phil is co-author of “Modern Web Development on the Jamstack” (O’Reilly, 2019). He post thoughts at @philhawksworth@indieweb.social and blogs at hawksworx.com/

Mark Zeman

Founder, SpeedCurve, @MarkZeman

Mark Zeman has loved the web since it began, designing his first website in '94. A craftsperson at heart he started SpeedCurve to bring code, pixels and great people together with a focus on improving user experience. Previously a creative director at Digital Arts and lecturer at Massey School of Design.

Pushing Pixels

Often when building websites, our units of measure are “pages”. It’s time to get more granular! Not every pixel on a page has the same importance. Users want to see the most important content first, while the ad team might want their content delivered early as well. Content elements need deliberate prioritisation rather than trying to make the whole page fast. Let’s pull the idea of a “page” apart and explore a design and development pipeline that focuses on islands of content. How do we then design, build and monitor the performance of our content islands?

Video, slides

Bas Schouten

Performance Tech Lead, Mozilla, @Schouten_B@mastodon.social

Bas Schouten works as the tech lead for Firefox performance at Mozilla. Coming from a background in physics and computer graphics, he is passionate about making performant, delightful experiences on the web accessible to users and content creators everywhere. An avid supporter of browser choice and the open web, he’s spent the last 5 years focusing on ensuring Firefox offers a viable alternative for a performant web experience.

Benchmarking Browsers

Web browsers are fast, but there’s constant demand for them to get faster. Developers want to build powerful sites, and users want a smooth browsing experience. But given the breadth of web content, it’s very hard for browser vendors to identify which optimizations will have the largest impact on the felt experience of actual people on the Web.

Making progress on this requires a shared understanding of what matters. Speedometer 3 started last year as a cross-industry collaborative effort to build a benchmark that reflects the real-world Web as much as possible.

In this session we’ll talk about the benchmark, how we built it to represent the modern Web, and how we’ve been using it to make web pages faster.

Video, slides

Nishu Goel

Engineer, epilot GmbH, @TheNishuGoel

Nishu Goel works with epilot GmbH on their micro-frontend architecture. She writes TypeScript and Golang at work with her focus on the performance aspects of the existing and upcoming codebases. She is the author of the book Angular Routing (BPB, 2019) and the JavaScript chapter of the 2021 Web Almanac. Recognised as a Google Developer Expert, and a Microsoft MVP, Nishu loves to share her work at unravelweb.dev.

Breaking Down Long Tasks

We will explore the pending Core Web Vital, Interaction to Next Paint that replaces FID in 2024 and diagnose it to solve pains with annoying long tasks in the browser, also using the Long Animation Frames API.

Video, slides

Keerthana Krishnan

Software Engineer, @KeerthanaK17

Keerthana Krishnan is a software engineer based in Munich, Germany. She has 4+ years of experience, mainly as a front-end web developer. She's also an experienced technical speaker who has previously presented at events like JS Conf Asia.

Optimizing your React Application

React has climbed the ranks to be the darling of developers everywhere when looking at a JS framework for front-end development. But as its popularity increases, do people really know the right way to use React? New evidence shows that despite its perks, websites written in React rank lower than average when comparing performance metrics. This session explores the key questions of React performance:

• What - What are the metrics of React performance measurement?
• Why - Why is this topic important?
• How - How can we improve the performance of your web application?

This presentation is React-specific and mainly focused on web applications but has some takeaways for other frameworks and mobile app developers as well.

Video, slides

Ryan Townsend

Fractional CTO, TWNSND, @RyanTownsend

With 20 years of experience developing for the web, and over 5 of those years as a hands-on CTO, Ryan Townsend has driven ecommerce growth for his clients measured in the hundreds of millions.

He cares deeply about user experience, particularly web performance, and his pragmatic outlook means that—on the rare occasion that he does wear a shirt—his sleeves stay firmly rolled up: even as an exec, he enjoys getting into the thick of things with developers.

Outside of the office, you’ll usually find him in the gym, recording video content for ‘Lessons of a CTO’ and trying not to get too many more points on his driving licence.

The Unbearable Weight of Massive JavaScript

For the past 10+ years, JavaScript frameworks and Single Page Applications have been marketed as the solution to all our performance, robustness and productivity problems, but things haven’t worked out the way we’d all hoped, have they?

• Simple marketing and ecommerce sites are still getting heavier and slower.
• Features fail in weird and wonderful ways meaning we need an ever-increasing array of tooling to monitor and debug problems.
• Teams armed with the latest Apple Silicon Macs, expensive CI tooling and complex build pipelines still can’t ship effectively.

But it’s not all doom-and-gloom: we live in a time of unprecedented opportunity to give our users a fantastic experience – the web platform has never been more capable than it is today.

Let’s look at what we can achieve by simplifying our web architecture, utilising new and upcoming Web Platform APIs and getting back to building fast, maintainable, user-friendly front-ends.

Video, slides

Tammy Everts

Chief Experience Officer, SpeedCurve, @tameverts

Tammy Everts is chief experience officer at SpeedCurve, where she helps companies understand how visitors use their websites, and a co-chair of performance.now(). Tammy has spent the past two decades studying how people use the web. Since 2009, she’s focused on the intersection between web performance, user experience, and business metrics. Her book, Time Is Money: The Business Value of Web Performance from O’Reilly, is a distillation of much of this research. She also cocurates (with Tim Kadlec) WPO Stats, a collection of performance case studies.

Creating Performance Impact in a Changing Tech Landscape

In this talk, Tammy will share best practices to chase impact in our current landscape of smaller teams, aggressive goals, and an ever-growing tech stack. Topics include how to:

• Identify your critical rendering path
• Focus on the pages that matter
• Fix the low-hanging fruit
• Manage expectations
• Use performance budgets to fight regressions
• Quantify success – and brag about it!

Video, slides

Robin Marx

Web Performance Expert, Akamai, @programmingart

Dr. Robin Marx is a Web Performance Expert at Akamai Technologies. He focuses on the performance and workings of modern Web protocols like HTTP/2, HTTP/3 and QUIC and has been a contributor in the IETF QUIC working group for multiple years.

Robin often talks about web performance at international conferences, making the complex situations more insightful to the wider public. On the weekends, he likes to hit other people with longswords.

Resource Loading at the Cutting Edge

When it comes to loading page resources, Web Developers are truly spoiled these days, with a plethora of mechanisms and protocol features to choose from. From resource hints to fetchpriority, via 103 Early Hints over prerender/prefetch, and from async/defer/module to fetch(), ... the list goes on and on (oh, and did I mention HTTP/3?). However, many of these options are often misunderstood, both in how they should function and how they actually function in the various main browsers.

In this deep-dive session, Robin starts from real-world examples to show how things like prioritization are supposed to work, how especially Chrome has some pretty advanced loading heuristics, how even the excellent WebPageTest can sometimes be misleading, and how to get started debugging this yourself with things like netlog and (*gasp*) wireshark.

You will walk away with a deeper understanding of what happens under the hood, which will allow you to better deal with the various gotchas and quirks present in today's browsers and resource loading features.

Video, slides

MC: Sia Karamalegos

Web Performance Engineer, Shopify, @sia@front-end.social

Sia Karamalegos is a web developer and performance engineer, currently working on web performance at Shopify. She's also an international conference speaker, writer, Google Developer Expert in Web Technologies, Cloudinary Ambassador, and Stripe Community Expert. She co-organizes the Eleventy Meetup which won the 2021 Jammies Award for Outstanding Community Meetup.

Matt Hobbs

Head of Frontend Development, Government Digital Service, @TheRealNooshu

Matt Hobbs is Head of Frontend Development at the Government Digital Service (GDS). An experienced frontend developer, he is passionate about using his skills to build accessible and performant user interfaces. Matt makes a point of keeping on top of the latest technology and tools, and is interested in all aspects of interface development, and is a keen advocate for best practices.

Bridging the Digital Divide using Web Performance

Reducing the digital divide is essential to create a more equitable and inclusive society, where everyone has equal access to information, opportunities, and the tools necessary to thrive in todays digital world. In this session I discuss how web performance plays a vital role in building this bridge.

Video, slides

Tim Vereecke

Web Performance Architect, Akamai, @TimVereecke

Tim Vereecke loves speeding up websites and likes to understand the technical and business aspects of WebPerf since 15+ years. He is a Web Performance Architect at Akamai, the inventor of frustrationindex.com and he also runs scalemates.com: the largest (and fastest!) scale modeling website on the planet.

Noise Canceling RUM

Noisy Real User Monitoring (RUM) data can ruin your day!

We introduce a fresh concept called "Human Visible Navigations" (HVN) to tackle this risk; we focus on the experiences you actually care about when talking about the speed of our sites:

• Human: We exclude noise coming from bots and synthetic measurements.
• Visible: We remove any partial or fully hidden experiences. These tend to be very slow but users don’t see this slowness.
• Navigations: We ignore lightning fast back-forward navigations which usually have few optimisation opportunities.

Adopting Human Visible Navigations provides you with these key benefits:

• Fewer changes staying below the radar
• Fewer data fluctuations
• Fewer blindspots when finding bottlenecks
• Better correlation with business metrics

This is supported by plenty of real world examples coming from the world's largest scale modeling site (6M Monthly visits) in combination with aggregated data from the brand new rumarchive.com.

Video, slides

Estela Franco

Web Performance Specialist, Schneider Electric, @guaca

Estela Franco is a Web Performance Specialist at Schneider Electric, a Google Developer Expert in Web Technologies, and a Storyblok ambassador. She has a background in technical SEO and web development and loves to focus on aspects that improve UX and page speed for both humans and robots.

Estela has been passionate about web performance since her first steps in SEO 10+ years ago to speed up bot crawling and improve organic rankings. However, she has been working specifically and deeply on web performance since the announcement of Core Web Vitals back in 2020.

Challenging Assumptions About LCP Best Practices (with data!)

When optimizing LCP, we can implement many techniques to improve its values. Each of these techniques focuses on a specific sub-part of LCP. But do you know which of these parts is more critical? Which optimizations should you prioritize to make a significant impact? In this talk, Estela will challenge the classic assumptions about optimizing LCP (using Chrome data!) and show how you can better prioritize your efforts to improve this metric.

Video, slides

Harry Roberts

Consultant Web Performance Engineer, @csswizardry

Harry Roberts is an independent Consultant Web Performance Engineer from the UK. He helps some of the world’s largest and most respected organisations find and fix their site-speed issues.

He is both a Google- and a Cloudinary Media-Developer Expert, and has consulted for clients from the United Nations to the BBC, General Electric to the Financial Times, and a whole host more. He is also co-chair of performance.now(), the web performance conference for professionals.

When not doing client work, he writes, teaches, and speaks about the entire gamut of front-end performance. When not doing work at all, he’s probably out on his bike.

Cache Rules Everything

Caching is something most developers take for granted, but experience tells me time and time again that most developers also don’t understand how to configure their caching rules safely, correctly, or effectively. Do you know what no-cache means? Do you know what the Pragma header does? Do you know the difference between Last-Modified or ETag? Expires or Cache-Control? You will soon.

In this talk, we’ll remove the noise, get rid of everything we don’t need, and then step through a series of real-life scenarios to work out how to solve almost any caching situation with a series of questions.

Video, slides

Jodie Chan

SVP of Product & Strategic Partnerships, Chinafy, @jodiewyc

Jodie Chan is the SVP of Product & Strategic Partnerships at Chinafy, the premier China web performance platform. With a singular focus on helping websites load fast, fully, and securely in China, Chinafy stands as the industry leader in tackling the unique challenges faced by Marketing & DevOps teams in the cross-border web landscape.

Since 2017, Jodie has been focused on finding innovative solutions to evolving cross-border web challenges for a diverse range of organizations, including publishers, financial institutions, listed multinational corporations, and universities.

Her expertise has been instrumental in successfully launching two Enterprise SaaS platforms, including Chinafy, and growing Chinafy's strategic partnership ecosystem, which includes industry giants such as Alibaba Cloud, AWS, WPVIP, and more.

When she's not donning her web performance detective hat, Jodie embraces her musical passions as Joya, an independent singer-songwriter. Her music can be found on Spotify, Apple Music, and more. Most recently, she has collaborated with National Geographic and has been recognized by MTV Asia as an Introducing artist to watch. Say hi to Jodie via LinkedIn, Twitter (@jodiewyc), or Instagram (@sheisjoya).

Decoding the Web in China for Peak Web Performance

Global web best practices often fall short in China's web environment. In this session, we'll tackle common misconceptions when it comes to China web performance, demystify the elusive Great Firewall in technical terms, and provide an evaluation framework using real-world case studies.

Video, slides

Patrick Meenan

Software Engineer, Google, @patmeenan

Patrick has been working on web performance in one form or another for the last 25 years and is currently working on the Chrome team at Google. Prior to that he worked on web performance at Cloudflare, Meta, Catchpoint, Google (again) and AOL. Patrick also created the WebPageTest web performance measurement tool.

Compression Dictionaries

Compression dictionaries have the potential to reduce HTML and resource sizes upwards of 90% and support delta-updates of code releases. Patrick will discuss how they can be used in your existing workflows, provide live examples as well as the current state of browser support and standardization.

Video, slides

Tim Kadlec

Web Performance Consultant, @tkadlec

Tim Kadlec is a performance consultant and trainer focused on building a web everyone can use. He is the author of High Performance Images (O’Reilly, 2016) and Implementing Responsive Design: Building sites for an anywhere, everywhere web (New Riders, 2012), and was a contributing author for Smashing Book #4: New Perspectives on Web Design (Smashing Magazine, 2013), and the Web Performance Daybook Volume 2 (O’Reilly, 2012). He writes about all things web at timkadlec.com. You can find him sharing his thoughts in a briefer format on Twitter at @tkadlec.

From Here to There

Video